<template>
	<view>
		<u-navbar leftIconColor="#fff" :titleStyle="{ color: '#fff' }" :bgColor="bgColor" title="联系上级"
			:placeholder="true" :autoBack="true"></u-navbar>
		<view class="note">

		</view>
		<view class="content" style="position: relative;z-index: 1;margin-top: 15px;width: 92%;margin: 0 auto;">
			<view style="padding: 15px 30px;border-radius: 10px;justify-content: space-between;" class="flex">
				<view class="box" style="flex-direction: column;align-items:flex-start;padding-top: 15px;width: 80%;">
					<view class="flex">
						<view class="tit">{{ infos.username }}</view>
						<view class="flex">
							<view class="flex" style="
								border-radius: 5px;
								border: 1px solid #39BA93;
								padding: 2px 4px;
								color: #30BF94;
								margin-left: 10px;
								font-size: 10px;
								background: #DEFFF2;
							">
								<image style="width: 10px;height: 10px;" src="/static/font/41.png" mode=""></image>
								{{ infos.authentication_text }}
							</view>
						</view>
					</view>
					<view class="box" style="padding: 15px 0;width: 100%;">
						<view class="tit" style="width: 20%;">微信号</view>
						<view class="" v-if="infos.qrcode != ''" style="padding-left: 10px;width: 80%;">
							<!-- <image @click="copy(infos.qrcode)" style="width: 14px; margin-right: 10px"
								src="/static/img/62.png" mode="widthFix"></image> -->
							<view class="tit" style="">{{ infos.qrcode }}</view>
						</view>
						<view v-if="infos.qrcode == null" class="tit" style="color: #f00">暂无</view>
					</view>
					<view class="flex" style="width: 100%;" @click="phone(infos.phone)">
						<view class="tit" style="width: 25%;">联系电话</view>
						<view class="flex" style="padding-left: 10px;width: 70%;">
							<view class="tit" >{{ infos.phone }}</view>
							<u-icon name="phone" color="#999999" size="16"></u-icon>
						</view>
						<!-- <image style="width: 14px; margin-right: 10px" src="/static/img/61.png" mode="widthFix"></image> -->
					</view>
				</view>
				<view class="box">
					<image style="width: 69px; border-radius: 50%; height: 69px" :src="imgurl + com_info.userHead"
						mode="">
					</image>
				</view>
				<!-- <view class="box">
					<view class="tit">手机号</view>
					<view class="flex" style="width: 80%; justify-content: flex-end" @click="phone(infos.phone)">
						<image style="width: 14px; margin-right: 10px" src="/static/img/61.png" mode="widthFix"></image>
						<view class="tit" style="">{{ infos.phone }}</view>
					</view>
				</view> -->
			</view>
			<!-- <view style="padding: 0px 15px; background-color: #fff; border-radius: 10px; margin-top: 15px">
				<view class="box">
					<view class="tit">微信号</view>
					<view class="flex" v-if="infos.qrcode != ''" style="width: 80%; justify-content: flex-end">
						<image @click="copy(infos.qrcode)" style="width: 14px; margin-right: 10px"
							src="/static/img/62.png" mode="widthFix"></image>
						<view class="tit">{{ infos.qrcode }}</view>
					</view>
					<view v-if="infos.qrcode == null" class="tit" style="color: #f00">暂无</view>
				</view> -->
			<!-- <view style="padding-bottom: 15px; padding-top: 15px">
			<view class="tit">微信二维码</view>
			<view style="height: 186px; line-height: 186px">
				<image
					v-if="infos.qrwxcode != ''"
					style="width: 185px; margin: 30px auto 15px; display: block"
					:src="$imgurl + infos.qrwxcode"
					mode="widthFix"
				></image>
				<view v-else style="font-size: 12px; color: #1d1f20; color: #aaacac; text-align: center">
					暂未添加微信名片
				</view>
			</view>
		</view> -->
			<!-- </view> -->
			<view class="" style="margin-top: 10px;padding: 0 20px 10px;position: absolute;bottom: 0;width: 88%;">
				<view class="flex" style="justify-content: space-between;">
					<text  style="font-size: 13px;font-weight: 400;color: #E8E8E8;">意见反馈</text>
					<u-icon @click="yijian" name="arrow-right" color="#fff"></u-icon>
				</view>
				<!-- <u-button @click="yijian" shape="circle" type="primary" text="意见反馈"></u-button> -->
			</view>
			<view style="font-size: 12px; color: #FF7A27; text-align: right;position: absolute;bottom: -25px;width: 100%;">
				长期联系不到上级，请点击意见反馈
			</view>
		</view>
	</view>
</template>

<script>
	import config from '../../common/config/index.js';
	export default {
		data() {
			return {
				infos: '',
				imgurl: config.imgurl,
				com_info: '',
				bgColor: 'rgba(255,255,255,0)',
			};
		},
		onLoad() {
			this.info();
			this.common();
		},
		onPageScroll(e) {
			if (e.scrollTop > 50) {
				this.bgColor = 'rgba(255,255,255,1)'
			} else {
				this.bgColor = 'rgba(255,255,255,0)'
			}
		},
		methods: {
			phone(e) {
				console.log(e);
				/**判断是否是手机号**/
				console.log(this.isPhoneNumber(e));
				if (!this.isPhoneNumber(e)) {
					this.$tips('非手机号码！');
				} else {
					uni.makePhoneCall({
						phoneNumber: e,
						success(res) {
							console.log(res);
						},
						complete(eee) {
							console.log(eee);
						},
						fail(err) {
							console.log(err);
						},
					});
				}
			},
			isPhoneNumber(tel) {
				var reg = /^0?1[3|4|5|6|7|8][0-9]\d{8}$/;
				return reg.test(tel);
			},
			async common() {
				let res = await this.$http.index.index();
				if (res.code == 1) {
					this.com_info = res.data;
				}
			},
			copy(e) {
				let that = this;
				uni.setClipboardData({
					data: e,
					success() {
						that.$tips('保存成功');
					},
				});
			},
			async info() {
				let res = await this.$http.car.contactSenior({});
				console.log(res);
				this.infos = res.data;
			},
			yijian() {
				uni.navigateTo({
					url: '/pages/me/our_feedback?type=2',
				});
			},
		},
	};
</script>

<style scoped lang="less">
	/deep/ .u-button--primary {
		background-color: #ff3331;
		border-color: #ff3331;
	}

	.content {
		background-image: url('@/static/font/40.png');
		height: 221px;
		background-size: 100% 100%;
	}

	.flex {
		display: flex;
		align-items: center;
	}

	.box {
		display: flex;
		align-items: center;
		// justify-content: space-between;
		padding: 15px 0;
		// border-bottom: 1px solid #f3f3f3;

		&:last-child {
			border-bottom: none !important;
		}
	}

	.note {
		background-image: url('@/static/font/39.png');
		height: 236px;
		width: 100%;
		background-size: 100% 100%;
		position: fixed;
		top: 0;
	}

	.tit {
		font-size: 14px;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #1d1f20;
	}
</style>
<style>
	page {
		background-color: #f7f9fa;
	}
</style>